<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>操作系统课程设计</title>
<link rel="icon" type="image/x-icon" href="img/linuxicon.png"/>
<link rel="stylesheet" href="index.css" type="text/css" />
<link rel="stylesheet" href="rightMyExecute.css" type="text/css" />
<link rel="stylesheet" href="tooltip.css" type="text/css" />
<link rel="stylesheet" href="tooltipl.css" type="text/css" />
<link rel="stylesheet" href="RightWindowDropDown.css" type="text/css" />
<link rel="stylesheet" href="DropDownl.css" type="text/css" />
<link rel="stylesheet" href="myfiletree.css" type="text/css" />
<script src="jquery-3.3.1.js"></script>
<script>
	//let funclist = {}, src = {};
	let initCall,initCalled, explains;
	let nowClicked;
	initCall = $.getJSON("json/initCall/call.json", function(jncall){
		initCalled = $.getJSON("json/initCall/called.json", function(jncalled){
			explains = $.getJSON("explains.json", function(jn)
			{
				$.each(jn,function(idx,obj){
					if(obj["folder"] != undefined && obj["folder"] == true)
					{
						//console.log(idx);
						$("#"+idx+"Word").click(function(){
							$("div#"+idx+"Component").toggle();
							outExplain(idx);
						});
					}
					else
					{
						$("#"+idx).click( function() {
							outExplain(idx);
							if(idx[idx.length-1] == 's')return;
							$.getJSON("json/cfile/"+idx+".json",function(jn0){
								$.ajax({url:obj["src"],dataType:"text",success:function(srcfile){
										addFunc(jn0,srcfile,idx);
									}});
							});
						});
					}
				});

				outExplain("sched_c");
				$.getJSON("json/cfile/sched_c.json",function(jn0){
					$.ajax({url:jn["sched_c"]["src"],dataType:"text",success:function(srcfile){
							addFunc(jn0,srcfile,"sched_c");
						}});
				});
			});
		});
	});


	function outExplain(name)
	{
		$("#DetailedExplain").html(explains.responseJSON[name]["detailed"]);
		$("a#nowFileName").text(name.slice(0,name.length-2) + "." + name[name.length-1]);
		$("div#srcSubstance").html("");
		nowClicked =name;
		/*if($("input#showSrcExplain").get(0).checked)
		{
			$("span#explainShowPos").html(explains.responseJSON[name]["brief"]);
		}*/
	}

	function addFunc(jn,srcfile,fileN)
	{
		//$("a#nowFileName").text(jn["file"]);
		let srcArr = srcfile.split('\n');
		$.each(jn["function"], function(idx,obj)
		{
			//build head
			let typeS = $("<span></span>").addClass("funcType").text(obj["type"]);
			let nameS = $("<span></span>").addClass("funcName").text(obj["name"]);
			let paraTot = $("<div></div>").addClass("tooltipl").html("<span>paras</span>");
			let paraS = $("<div></div>").addClass("tooltiptextl");
			$.each(obj["para"], function(idx1, obj1)
			{
				let paraT = $("<span></span>").addClass("paraType").text(obj1["paraType"]);
				let paraN = $("<span></span>").addClass("paraName").text(obj1["paraName"]);
				paraS.append(paraT).append(paraN).append($("<br/>"));
				paraTot.append(paraS);
			});
			let tHead = $("<div></div>").addClass("srcFuncDef");
			tHead.append(typeS).append(nameS);
			if(paraS.html()!="")
				tHead.append(paraTot);

			//build tbody
			let tbdy = $("<div></div>").addClass("srcCodePart").attr({"id":fileN + obj["name"]}).toggle();
			let bStr = srcArr.slice(obj["startline"]+1,obj["startline"]+obj["spanline"]+1);
			$.each(bStr, function(idx1, obj1){
				//console.log(obj1);
				tbdy.append($("<span></span>").html(obj1)).append($("<br/>"));
			});

			tHead.click(function(){
				$("div#"+fileN + obj["name"]).toggle();
			});

			$("div#srcSubstance").append($("<div></div>").append(tHead).append(tbdy));
		});
	}

	$(document).ready(
		function()
		{
			//window.open("drawCalled.html");
			$("a#fileCallButton").click(
			function()
			{
				window.open("drawCalled.html");
			}
			);
			$("a#funcCallButton").click(
			function()
			{
				window.open("drawCalledMaxFunc.html?drawcnt=20");
			}
			);
			$("a#nowFileCallButton").click(
			function()
			{
				window.open("drawCalledFunc.html?filename="+nowClicked);
			}
			);

		}
	);
</script>
</head>
<body>

	<div id="myMainBody">
		<div id="myFileAndMemory">
			<div id="myFile">
				<header style="width: 600px; height: 20px;">
					<div style="width: 150px; height: 20px; border-right: 2px black solid; float:left; display:inline;">
						<a id="nowFileName"></a>
					</div>
					<div class="dropdownl" style="margin-left: -50px;">
						<div class="dropbtnl">文件简介</div>
						<div class="dropdown-contentl">
							<a id="DetailedExplain"></a>
						</div>
					</div>
					<div class="dropdown" style="margin-left:250px;">
						<div class="dropbtn">调用情况</div>
						<div class="dropdown-content">
							<a id="fileCallButton">全局文件调用</a>
							<a id="funcCallButton">全局函数调用</a>
							<a id="nowFileCallButton">本文件函数调用</a>
						</div>
					</div>
				</header>

				<script src="srcList.js"></script>
				<div id="srcSubstance" style="height: 400px; background-color: white; overflow-y: auto;">

				</div>

			</div>
			<script src="memory.js"></script>
		</div>
		<div id="myExecute">
			<div id="myLogWindow">
				<header id="myLogHeader">
					<img class="myIcon" src="img/logheader.png" alt="Log"/>
					Debug Log
					<div class="myRightMenu">
						<div class="dropdown">
							<div class="dropbtn">选项</div>
							<div class="dropdown-content">
								<a href="drawVis.html">导入字符数据</a>
							</div>
						</div>
					</div>
				</header>
				<script src="logBtnBar.js"></script>
				<div id="myLogWindowOutput"></div>
			</div>

			<script src="rightConsole.js"></script>
			<script>$("textarea#myScreenWindowOutput").attr({"style":"font-size: 10px; resize: none;"});</script>
		</div>
	</div>
	<footer>
		linux0.11运行可视化 Created by 宋振华、陈宇翔. 指导老师：杨兴强
	</footer>
</body>
</html>